<template>
<div class="page_rela_container">
		<div class="scroll_auto flex_cell">
    <el-form id="page_order_create" ref="form" :model="form" :rules="rules" v-loading="loading"
      class="common-form-row common-form-panel-div-right" label-position="right" label-width="140px"
      style="margin-bottom: 90px;">


      <ex_header_spiler :title="$tt('label_base_info')"></ex_header_spiler>
      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_company_name')" prop="companyName">
            <ex_super_input v-model="form.companyName" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_company_code')" prop="companyCode">
            <ex_super_input v-model="form.companyCode"
              :disabled="form.id !== '' && form.id !== null && form.id !== undefined" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_company_short')" prop="companyShortName">
            <ex_super_input v-model="form.companyShortName" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_unified_credit_code')" prop="companyCreditCode">
            <ex_super_input v-model="form.companyCreditCode" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_corporate_ID_number')" prop="legalIdNo">
            <ex_super_input v-model="form.legalIdNo" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_Business_License_Attachment')" prop="licenseFile">
            <ex_super_upload type="image" v-model="form.licenseFile" :imageBoxSize="100" onlySingle onlyUrl key="licenseFile" accept='.jpg,.png,.jpeg' />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_Attachment_Corporate_Identity_Card')" prop="legalIdNoFiles">
            <ex_super_upload type="image" v-model="form.legalIdNoFiles" :imageBoxSize="100" onlyUrl :limit="2" key="legalIdNoFiles" accept='.jpg,.png,.jpeg' />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
   
        <el-col>
          <el-form-item :label="$tt('label_legal_person_name')" prop="legalPerson">
            <ex_super_input v-model="form.legalPerson" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_company_landline')" prop="companyTel">
            <ex_super_input v-model="form.companyTel" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_mailbox')" prop="email">
            <ex_super_input v-model="form.email" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_country')" prop="country">
            <country_select v-model="form.country" optionValue="countryName"
              url="/oms-api/base/OmsCountryRpc/selectAllLabel.json" class="w_fill" />
          </el-form-item>
        </el-col>

      </el-row>

      <el-row>
        <el-col :span="2">
          <el-form-item :label="$tt('label_register_address')" prop="registAddress">
            <ex-address v-model="form.registAddress"></ex-address>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="2">
          <el-form-item :label="$tt('label_mail_address')" prop="mailAddress">
            <ex-address v-model="form.mailAddress"></ex-address>
          </el-form-item>
        </el-col>
      </el-row>

      <ex_header_spiler :title="$tt('label_contact_info')"></ex_header_spiler>

      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_contact_name')" prop="contactName">
            <ex_super_input v-model="form.contactName" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_contact_idcard_number')" prop="contactIdNo">
            <ex_super_input v-model="form.contactIdNo" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_contact_phone')" prop="contactPhone">
            <ex_super_input v-model="form.contactPhone" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('label_contact_job')" prop="contactPosition">
            <ex_super_input v-model="form.contactPosition" />
          </el-form-item>
        </el-col>
      </el-row>
      <ex_header_spiler title="业务数据"></ex_header_spiler>
      <el-row>
        <el-col>
          <el-form-item :label="$tt('label_sku_return_method')" prop="returnProcessMethodList">
            <ex_super_input v-model="form.returnProcessMethodList" type="select" enum="SkuReturnMethodEnum"
              multiple class="w_fill" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-form-item :label="$tt('销售代表')" prop="saleUserSecurityId">
            <common_user_select v-model="form.saleUserSecurityId"
              :currentLabel="form.saleUserSecurityId ? form.companySaleName : null" @changeItem="singleSaleChange"
              style="width: 100%;"></common_user_select>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item :label="$tt('客服代表')" prop="cserUserSecurityId">
            <common_user_select v-model="form.cserUserSecurityId"
              :currentLabel="form.cserUserSecurityId ? form.companyCserName : null" @changeItem="singleCsuerChange"
              style="width: 100%;"></common_user_select>
          </el-form-item>
        </el-col>
      </el-row>


      <el-row>
        <el-form-item label="分配仓库" label-position="top">
          <el-transfer filterable :titles="['待分配仓库', '已分配仓库']" :button-texts="['取消', '分配']" :props="{
            key: 'id',
            value: 'name',
            label: 'name'
          }" :filter-method="filterMethod" filter-placeholder="请输入仓库名称" v-model="form.companyWarehouseIds"
            :data="allWarehouseList">
          </el-transfer>
        </el-form-item>
      </el-row>

    </el-form>
  </div>
    <div class="page_rela_bottom_area">

      <template>
        <el-button type="primary" @click="submit">{{ $tt('label_submit') }}</el-button>
        <el-button @click="return_page_back">{{ $tt('label_cancel') }}</el-button>
      </template>
    </div>



  </div>
</template>
<script>
import { mapState } from "vuex";

let default_obj = {
  companyName: "",
  returnProcessMethodList: [],
  companySaleName: '',
  companyCserName: '',
  licenseFile:null,
  legalIdNoFiles:null,
}
import country_select from '@/component/tms/country_select'

import router_params from '@/mixin/router_params';
export default {
  mixins: [router_params],
  components: { country_select },

  data() {
    return {
      edit: false,
      loading: false,
      form: _.cloneDeep(default_obj),
      rules: {
        companyName: [
          { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
          { min: 1, max: 32, message: this.$tt('tip_length_in_min_max', { min: 1, max: 32 }), trigger: 'blur' }
        ],
        companyCode: [
          { required: true, message: this.$tt('tip_can_no_empty'), trigger: 'blur' },
          { min: 1, max: 16, message: this.$tt('tip_length_in_min_max', { min: 1, max: 16 }), trigger: 'blur' }
        ]
      },


    };
  },
  computed: {
    ...mapState({ allWarehouseList: state => state.allWarehouseList }),
  },
  mounted() {
    // this.initWarehouse()
  },
  methods: {
    // initWarehouse() {
    //   this.$ajax({
    //     url: '/oms-api/base/OmsBaseWarehouseRpc/selectAllLabel.json?isEnable="Y"',
    //     success: (res) => {
    //       if (res && res.data && res.data.rows) {
    //         this.warehouseList = res.data.rows

    //       }
    //     }
    //   })
    // },
    singleSaleChange(e) {
      if (!e) e = { userId: null, userName: null }
      this.$set(this.form, 'saleUserSecurityId', e.userId)
      this.$set(this.form, 'companySaleName', e.userName)
    },
    singleCsuerChange(e) {
      if (!e) e = { userId: null, userName: null }
      this.$set(this.form, 'cserUserSecurityId', e.userId)
      this.$set(this.form, 'companyCserName', e.userName)
    },

    init_data_default(into_params) {
      this.form = _.cloneDeep(default_obj)
      this.edit = !!into_params.edit
      if (this.edit) {
        if (into_params.id) {
          this.loading = true
          this.$ajax({
            url: this.$url['ums/customerDetail'],
            method: 'post',
            data: { id: into_params.id },
            success: (res) => {
              if (into_params.copy) {
                delete res.data.id
                this.edit = false
              }
              // if(_.isEmpty(res.data.licenseFile)){
              //   res.data.licenseFile = []
              // }else{
              //   res.data.licenseFile = [{filePath:res.data.licenseFile}]
              // }
              // if(_.isEmpty(res.data.legalIdNoFiles)){
              //   res.data.legalIdNoFiles = []
              // }else{
              //   res.data.legalIdNoFiles = [{filePath:res.data.legalIdNoFiles}]
              // }
              
              this.form = res.data
              this.fixTabLabel()
            },
            complete: () => {
              this.loading = false
            }
          })
        }
      }
      this.fixTabLabel()
    },
    fixTabLabel() {
      if (this.edit && !!this.form.id) {
        this.$emit("tagModifyLabel", {
          _key: 'label_name_code', name: this.$tt("label_edit_customer"),
          code: this.form.companyName || ""
        })
      } else {
        this.$emit("tagModifyLabel", "label_add_customer")
      }
    },

    submit() {
      this.$refs['form'].validate((valid, obj) => {
        if (valid) {

          let data = _.cloneDeep(this.form)
   
          this.$ajax({
            url: this.$url['ums/customerSaveUpdate'],
            method: 'post',
            type: 'json',
            loading: true,
            data: data,
            success: (res) => {
              this.$message.success(this.$tt('tip_submit_success'))
              this.return_emit(null, "reload")
              this.$tag.tagClose(null, this.intoPath)
            }
          })
        } else {
          this.$message.error(this.$tt('form_validate_error'))
          return false;
        }
      });

    },
    filterMethod(query, item) {
      const checkList = ['name', 'code']
      return checkList.some(it => item[it] && item[it].indexOf(query) > -1);
    },
  }
};

</script>
<style></style>
